<template>
  <section class="padding">
    <BasicInfo
      ref="basic"
      :countryMap="initData.countryMap"
      :customerAll="initData.customerMap"
      :customerPermissionsMap="initData.customerPermissionsMap"
      :serviceItemMap="initData.serviceItemMap"
      :isCreate="true"
    ></BasicInfo>

    <CargoInfo
      ref="cargo"
      class="margin-top"
      :goodsInfo.sync="goodsInfo"
    ></CargoInfo>
    <div class="padding text-center">
      <el-button type="success" @click="submitForm('ruleForm', 10)"
        >提交待确认</el-button
      >
      <el-button type="success" @click="submitForm('ruleForm', 20)"
        >提交待审批</el-button
      >
    </div>
  </section>
</template>

<script>
import BasicInfo from "./components/BasicInfo";
import CargoInfo from "./components/CargoInfo";
// import { mapGetters } from 'vuex'
import { checkRowsEmpty } from "@/utils";
import { ajax, getQueryVariable } from "@/store/yg/common/utils";
// import {
//   saveAbroadWaybill,
//   initAbroadWaybillRender,
//   downLoadGoodsInfo
// } from '@/api/abroadWaybill'
export default {
  name: "OrderToOrderToOverseasWarehouseShipping",
  // computed: {
  //   ...mapGetters(['publicData'])
  // },
  components: {
    CargoInfo,
    BasicInfo
  },
  data() {
    return {
      waybillId: "",
      goodsInfo: [{}, {}, {}, {}, {}, {}],
      initData: {},
      actionUrl: "/abroad/waybill/batchUploadGoodsInfoData",
      uploadDialog: false
    };
  },

  mounted() {
    this.init();
  },
  methods: {
    async init() {
      const { data } = await ajax("initAbroadWaybillRender", {});
      this.initData = data;
      console.log("data :>> ", data);
    },
    submitForm(formName, status) {
      const hotTable = this.$refs.cargo.$refs.hotTable.data.filter(x =>
        checkRowsEmpty(x)
      );
      this.$refs.basic.$refs[formName].validate(valid => {
        if (valid) {
          if (hotTable.length === 0) {
            this.$message.error("请填写必填信息");
            return;
          }
          for (const [i, e] of hotTable.entries()) {
            if (!e.sku || !e.productName) {
              this.$message.error(`请填写第${i + 1}行 必填数据`);
              return;
            }
          }
          this.saveInfo(status);
        } else {
          console.log("error submit!!");
        }
      });

      return;
    },
    async saveInfo(status) {
      // this.$store.dispatch("app/toggleDialog", true);
      // console.log("this.$store.state.user.id :>> ", this.$store.state.user.id);
      const ruleForm = this.$refs.basic.ruleForm;

      const goodsInfo = [];
      for (const i of this.goodsInfo) {
        if (i.sku) {
          goodsInfo.push(i);
        }
      }

      ruleForm.waybillGoodsInfos = goodsInfo;
      ruleForm.status = status;
      ruleForm.cuser = parseInt(this.$store.state.auth.user.id);

      ruleForm.serviceItem = this.$refs.basic.ruleForm.serviceItemArr.join();
      const { code, data: waybillId } = await ajax(
        "saveAbroadWaybill",
        ruleForm
      );
      if (code === 200) {
        this.$message({
          type: "success",
          message: "提交成功"
        });
        // this.$router.push({ name: "AbroadWaybillList" });
        if (status == 10) {
          window.open("/#/main/waybill__abroadwaiting__list", "_self");
        } else {
          window.open("/#/main/waybill__abroadwaitapproval__list", "_self");
        }
        this.waybillId = waybillId;
      }
      // this.$store.dispatch("app/toggleDialog", false);
    },
    closeDialog() {
      this.uploadDialog = false;
    },
    async downloadCargoInfo() {
      const data = await ajax("downLoadGoodsInfo", {
        waybillId: this.waybillId
      });
    },
    uploadCargoInfo(file) {
      console.log("uploadCargoInfo", file);
    }
  }
};
</script>

<style lang="scss" scoped>
.relative {
  .absolute {
    right: 10px;
    top: -40%;
  }
}
</style>
